<template>
  <div id="app">
    <h1>state: {{ $store.state.n }}</h1>
    {{ cn }}
    <h2>getters:{{ $store.getters.money }}</h2>
    <button @click="$store.commit('jiajia', 1)">+1</button>
    <button @click="fn1">1</button>
    <button @click="jiajia(1)">1</button>
    <button @click="jiajiajia(1)">1</button>
    <button @click="$store.dispatch('jia')">3s +1</button>

    <router-view />
  </div>
</template>
<script>
import { mapState, mapMutations } from "vuex";
export default {
  computed: {
    cn() {
      return this.$store.state.n;
    },
    ...mapState(["n"]),
    ...mapState({
      nn: (state) => state.n,
    }),
  },
  methods: {
    fn1() {
      this.$store.commit("jiajia", 1);
    },
    ...mapMutations(["jiajia"]),
    ...mapMutations({
      jiajiajia: "jiajia",
    }),
  },
};
</script>
